

<div style="width: 150px; height: 499px; padding-top: 1px;" align="center">

       <ul id="acordionDer" style="padding-top: 20px;">
              <li>Socio-Afiliado</li>
              <ul>
                     <li><a href="?p=socio/insertarSocio">Insertar</a></li>
                     <li><a href="?p=socio/listarSocio">Listar</a></li>
                     <li><a href="?p=socio/buscarSocio">Buscar</a></li>
                     <li><a href="?p=socio/modificarSocio">Modificar</a></li>
                     <li><a href="?p=socio/eliminarSocio">Eliminar</a></li>
              </ul>
              <li>Camion</li>
              <ul>
                     <li><a href="?p=camion/insertarCamion">Insertar</a></li>
                     <li><a href="?p=camion/eliminarCamion">Eliminar</a></li>
              </ul>
              <li>Empresa</li>
              <ul>
                     <li><a href="?p=empresa/insertarEmpresa">Insertar</a></li>
                     <li><a href="?p=empresa/listarEmpresa">Listar</a></li>
                     <li><a href="?p=empresa/buscarEmpresa">Buscar</a></li>
                     <li><a href="?p=empresa/modificarEmpresa">Modificar</a></li>
                     <li><a href="?p=empresa/eliminarEmpresa">Eliminar</a></li>
              </ul>
<!--              <li>Ciudad</li>
              <ul>
                     <li><a href="?p=ciudad/insertarCiudad">Insertar</a></li>
                     <li><a href="?p=ciudad/listarCiudad">Listar</a></l
              </ul>-->
       </ul>


</div>
<!-- SCRIPT QUE HACE EL ACORDEON -->
<script>
       $("#acordionDer > li").click(function(){

              if(false == $(this).next().is(':visible')) {
                     $('#acordionDer > ul').slideUp(300);
              }
              $(this).next().slideToggle(300);
       });

       //$('#acordionDer > ul:eq(0)').show();
</script>
